.reader {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
  background: #c5b49a;

  // 书签
  .bookDrawer {
    .ant-drawer-body {
      padding: 0;
      background: #c5b49a;
      overflow: hidden;
      width: 100%;
      height: 100%;

      h3 {
        text-align: center;
        font-size: 1.5rem;
        color: #5c5d64;
        padding: 3vw 0;
        border-bottom: 2px solid #ed424b;
        margin-bottom: 0;
        color: #ed424b;
      }

      .bookDrawer_body {
        width: 100%;
        height: 90%;
        overflow: auto;

        li {
          margin: 4vw 0;
          width: 100%;
          height: 10vw;
          padding: 0 4vw;

          .bookDrawer_body_con {
            font-size: 1rem;
            overflow: hidden; //超出的文本隐藏
            text-overflow: ellipsis; //溢出用省略号显示
            white-space: nowrap; //溢出不换行
          }

          .bookDrawer_body_time {
            width: 100%;
            height: 5vw;
            display: flex;
            align-items: center;

            h4 {
              width: 30%;
              overflow: hidden; //超出的文本隐藏
              text-overflow: ellipsis; //溢出用省略号显示
              white-space: nowrap; //溢出不换行
            }
          }
        }
      }
    }
  }

  // 左侧目录
  .readerDrawer {
    .ant-drawer-body {
      padding: 0;
      background: #c5b49a;
      overflow: hidden;
      width: 100%;
      height: 100%;

      h3 {
        text-align: center;
        font-size: 1.5rem;
        color: #5c5d64;
        padding: 3vw 0;
        border-bottom: 2px solid #ed424b;
        margin-bottom: 0;
        color: #ed424b;
      }

      .readerDrawer_body {
        width: 100%;
        height: 90%;
        padding: 2vw 5vw;
        margin-bottom: 0;
        padding-top: 0;
        overflow: auto;

        ul {
          width: 100%;
          height: auto;
          margin-bottom: 0;

          li {
            list-style: none;
            margin: 5vw 0;
            overflow: hidden; //超出的文本隐藏
            text-overflow: ellipsis; //溢出用省略号显示
            white-space: nowrap; //溢出不换行
            font-size: 1rem;
          }

          .border {
            color: #ed424b;
          }
        }
      }
    }
  }

  .reader_h3 {
    width: 100%;
    height: 10%;
    line-height: 10vw;
    display: flex;

    h3 {
      padding-left: 4vw;
      color: rgba(0, 0, 0, .4);
      width: 90%;
    }
  }

  .reader_body {
    width: 100%;
    height: 95%;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
    margin-top: 9%;
    padding-top: 8vw;
    padding-bottom: 5vh;

    .textHrem {
      text-align: center;
      font-size: 1.5rem;
      color: #5c5d64 !important;
      font-weight: 600;
      margin-top: 2vw;
    }

    .reader_body_const {
      width: 100%;
      height: auto;
      font-size: 1.25rem;
      padding: 0.3rem 1rem;
    }
  }

  .ant-modal-mask {
    background: rgba(0, 0, 0, 0);
  }

  // 设置的样式
  .readerBoxSeet {
    max-width: calc(100vw);
    height: 40%;
    background-color: rgba(0, 0, 0, .8);
    color: rgba(255, 255, 255, .8);
    padding-bottom: 0;
    position: absolute;
    left: 0;
    bottom: 0;
    right: 0;
    top: 60%;
    margin: 0;

    .ant-modal-content {
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, .1);
      right: 0;
      padding-top: 6vw;

      .readerBoxSeet_body_size {
        width: 100%;
        height: 10vw;
        display: flex;
        justify-content: space-around;
        align-items: center;
        margin: 0 auto;
        margin-bottom: 5vw;
        padding: 0 8vw;

        .readerBoxSeetBodySize {
          width: 10vw;
          height: 10vw;
          font-size: 1.4rem;
          line-height: 10vw;
          text-align: center;
        }

        .readerBoxSeet_body_size_jia,
        .readerBoxSeet_body_size_jian {
          width: 25%;
          height: 9vw;
          border: 1px solid #fff;
          text-align: center;
          font-size: 1.5rem;
          line-height: 8vw;
          border-radius: 5px;
        }
      }

      .readerBoxSeetBodyBack {
        width: 95%;
        height: 23vw;
        margin: 0 auto;
        display: flex;
        justify-content: space-around;
        align-items: center;
        border-top: 1px solid rgba(255, 255, 255, .1);
        margin-top: 2vw;

        li {
          width: 18%;
          height: 10vw;
          list-style: none;
          border-radius: 5px;
          border-top: 1px solid rgba(255, 255, 255, 0);

          .readerBoxSeetBodyBack_check {
            text-align: center;
            display: block;
            margin: 1.5vw auto;
            font-size: 1.8rem;
            color: #ed424b;
          }
        }
      }

      .readerBoxSeetBodyBackTop {
        width: 100%;
        height: 10vw;
        position: absolute;
        top: -150%;
        left: 0;
        padding-top: 2vw;
        background-color: rgba(0, 0, 0, .8);

        .readerBoxSeetBodyBackTopHome {
          font-size: 1.5rem;
          width: 10vw;
          height: 10vw;
          line-height: 8vw;
          padding-left: 1vw;
        }

        img {
          position: absolute;
          right: 5vw;
        }
      }

      .readerBoxSeetBodyBackBottom {
        width: 100%;
        height: 15vw;
        display: flex;
        justify-content: space-around;
        align-items: center;
        margin-bottom: 0;

        li {
          width: 20vw;
          height: 15vw;
          list-style: none;

          img {
            display: block;
            margin: 1vw auto;
          }

          .readerBoxSeetBodyBackBottom_unorder {
            font-size: 1.8rem;
            display: block;
            margin: 1vw auto;
          }

          p {
            text-align: center;
          }
        }
      }
    }
  }
}

// 下一章的样式
.LoadingNextChapter {
  color: #dedede;
  font-weight: 600;
  font-size: 1rem;

  .ant-message-notice-content {
    background: rgba(0, 0, 0, 0);
    box-shadow: none;
  }

  .anticon,
  .anticon-success {
    display: none;
  }
}